<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1" />
	<title>未来家园主题乐园</title>
	<link rel="stylesheet" href="./src/lib/bootstrap/css/bootstrap.min.css" />
	<link rel="stylesheet" href="./src/lib/css/reset.css" />
	<link rel="stylesheet" href="./src/css/header.min.css" />
	<link rel="stylesheet" href="./src/css/visitor.min.css" />
	<!-- bootstrap 图标库cdn -->
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css" />
</head>

<body>
	<header id="header"></header>
	<div id="banner">
		<img src="./src/images/banner_product.png" alt="风景" class="w-100" />
	</div>
	<div class="container_m">
		<div class="tabbar_c">
			<a class="collapseBtn" data-toggle="collapse" href="#collapseTabbar" role="button" aria-expanded="true"
				aria-controls="collapseTabbar">
				<div class="d-flex justify-content-between align-items-center">
					<label style="width: 16px"></label>
					<label class="mb-0">类目</label>
					<i class="bi bi-chevron-down" style="font-size: 1rem"></i>
				</div>
			</a>
			<div class="collapse show" id="collapseTabbar">
				<div class="tabbar_m">
					<div class="tabbar active" data-key="notice">须知</div>
					<!-- <div class="tabbar" data-key="map">景点地图</div> -->
					<div class="tabbar" data-key="hours">开放时间</div>
					<div class="tabbar" data-key="traffic">交通指引</div>
					<div class="tabbar" data-key="suggest">投诉建议</div>
				</div>
			</div>
		</div>
		<div class="notice container p-0">
			<div class="row">
				<div class="col-lg-2 col-xl-2 mb-4 border-b">
					<a class="collapseNoticeBtn" data-toggle="collapse" href="#collapseNotice" role="button"
						aria-expanded="true" aria-controls="collapseNotice ">
						<div class="d-flex justify-content-between align-items-center">
							<label style="width: 16px"></label>
							<label class="mb-0">类目</label>
							<i class="bi bi-chevron-down" style="font-size: 1rem"></i>
						</div>
					</a>
					<ul class="list-group list-group-flush collapse show  text-center collapseNotice "  id="collapseNotice">
						<li class="list-group-item active" data-name="antiepidemic">
							防疫须知
						</li>
						<li class="list-group-item" data-name="play">游玩须知</li>
					</ul>
				</div>
				<div class="antiepidemic col-lg-10 col-xl-10">
					<div class="text">
						<p>尊敬的游客朋友们:</p>
						<p>
							生命重于泰山，疫情就是命令，防控就是责任，为了您健康安全的出游，让我们共同携手，做好疫情防控，现就我司管辖各景区疫情防控措施通告如下:
						</p>
						<p>一、为了避免人员密集，采取预约制时间限流管控措施</p>
						<p>
							二、疫情期间为规范景区管控，景区实行实名制网络购票，减少人员直接接触。
						</p>
						<p>
							三、按照疫情防控管理规定，游客到景区游览须全程佩戴口罩，出示健康码、测量体温实名登记车辆消毒，方可进入景区游览。
						</p>
						<p>
							1.游客未戴口罩或丢失破损，景区按照疫情防控管理规定，预于劝导，拒绝接待游客入园，游客不听劝阻，寻衅闹事者，景区及时联系相关执法部门处理。
						</p>
						<p>
							2.游客体温如有异常，请积极配合景区工作人员劝导，到临时隔离区用水银体温计再次测量，如体温>37.9,
							请配合景区工作人员工作，等待疫情防控中心接应。
						</p>
						<p>
							四、为了游客自身安全，避免人员密集，景区实行游客限流管控，请自觉遵守景区管理秩序，文明旅游，保持安全距离，不在路椅上躺卧，不扎堆聊天，不拥挤插队打闹，不随意丢弃口罩，不随地吐痰，不乱扔垃圾，不打架斗殴，寻衅滋事，偷窃等违法犯罪行为，严禁携带危险品入园，禁止毁坏财物，请您注意景区的安全警示标志，请勿攀爬、翻越安全防护栏;上下台阶时要小心谨慎。严禁携带火种进入景区，严禁在景区内吸烟、要注意保管好自己的随身物品，以防丢失;儿童、行动不便的老人须在家人的陪同下游园。共同做好安全防控，健康安全出游。
						</p>
						<p>
							五、请您自觉遵守法律法规，禁止在景区内捡拾垃圾物品和行乞，禁止在景区内私搭乱建、进行非法经营、迷信活动和低俗不健康行为，严禁在景区兜售物品，严禁在景区内散发、张贴任何形式的广告、宣传品，严禁以任何形式进行赌博和其他非法活动。情节严重者移交相关部门门处理。
						</p>
						<p>
							六、游客进入景区内，请您保护景区资源，自觉爱护景区花草果树木，不攀爬折枝，不摘花采果、不采挖植物，不破坏设施标牌，不乱涂抹刻画或张贴、悬挂物品等破坏景区的不良行为。
						</p>
						<p>
							七、请自觉遵守景区疫情的各项管理规定，服从景区工作人员的管理。
						</p>
					</div>
				</div>
				<div class="play col-lg-10 col-xl-10">
					<div class="text">
						<p>优惠半价门票说明:</p>
						<p>①1.2米一-1.4米儿童 可购买优惠半价门票;</p>
						<p>②60 -65周岁 老年人可凭身份证或老年证可购买优惠半价门票;</p>
						<p>
							③小学生、初中生、高中生、大学生可凭学生证购买优惠半价门票(研究生、留学生除外)。
						</p>
						<p>免门票说明:</p>
						<p>①1.2米以下儿童,免门票入园;</p>
						<p>②65周岁以上老年人凭身份证或老年证，免门票入园;</p>
						<p>③残疾人凭残疾证，免门费入园;</p>
						<p>④现役军人凭士兵证，士官证或军官证，免门费入园;</p>
						<p>⑤导游带团可凭导游证+旅行社派遣单,免门票入园;</p>
						<p>
							⑥伤残军人，军人离休干部，消防救援人员(都是凭有效证件)免门票入园;
						</p>
						<p>⑦援鄂医护人员及湖北省医护人员凭证件免票。</p>
						<p>
							⑧持有大武汉旅游年卡、湖北旅游年卡、腾旅-卡通的游客直接刷年卡入园。
							严禁携带物品说明:
						</p>
						<p>①不能携带中型、大型宠物犬进入景区(20斤以上) ;</p>
						<p>②不能携带烧烤炉、酒精炉进入景区;</p>
						<p>
							③不能开车进入景区;不能携带儿童自行车、成人自行车进入景区。
							寄存物品和租借物品说明:
						</p>
						<p>①游客中心咨询台工作时间8: 00--17: 00可以寄存物品。</p>
						<p>②可租借用雨伞、儿童推车、轮椅(需交押金)。</p>
					</div>
				</div>
			</div>
		</div>
		<div class="hours container p-0">
			<div class="row">
				<div class="col-lg-2 col-xl-2 mb-4 border-b">
					<a class="collapseHoursBtn" data-toggle="collapse" href="#collapseHours" role="button"
						aria-expanded="true" aria-controls="collapseHours">
						<div class="d-flex justify-content-between align-items-center">
							<label style="width: 16px"></label>
							<label class="mb-0">类目</label>
							<i class="bi bi-chevron-down" style="font-size: 1rem"></i>
						</div>
					</a>
					<ul class="list-group list-group-flush text-center show  collapse collapseHours" id="collapseHours">
						<li class="list-group-item active" data-name="spring">
							春季（1~3月）
						</li>
						<li class="list-group-item" data-name="summer">夏季</li>
						<li class="list-group-item" data-name="autumn">秋季</li>
						<li class="list-group-item" data-name="play">冬季</li>
					</ul>
				</div>
				<div class="spring col-lg-10 col-xl-10">
					<table width="100%" border="1">
						<tr>
							<th>项目</th>
							<th>开放时间</th>
							<th>说明</th>
						</tr>
						<tr>
							<td>游客中心</td>
							<td>6:30 ~ 17:30</td>
							<td>配讲解原1 ~ 2名，中英文讲解</td>
						</tr>
						<tr>
							<td>黄金螺旋广场</td>
							<td>8:00 ~ 10:00 11:30 ~ 12: 30</td>
							<td>音乐启停</td>
						</tr>
						<tr>
							<td>桑椹园</td>
							<td>10: 30~ 12: 00 14: 00~ 16: 00</td>
							<td>配专用篮，不能用手摘</td>
						</tr>
					</table>
				</div>
			</div>
		</div>
		<div class="suggest container p-0">
			<form>
				<div class="flexBox">
					<div class="label">姓名：</div>
					<input type="text" class="flex name" name="name" autocomplete="off" />
					<div class="tips">*</div>
				</div>
				<div class="flexBox">
					<div class="label">联系电话：</div>
					<input type="tel" class="flex mobile" name="mobile" autocomplete="off" />
					<div class="tips">*</div>
				</div>
				<div class="flexBox">
					<div class="label">电子邮箱：</div>
					<input type="email" class="flex email" name="email" autocomplete="off" />
					<div class="tips">*</div>
				</div>
				<div class="flexBox">
					<div class="label">主题：</div>
					<input type="text" class="flex title" name="title" autocomplete="off" />
					<div class="tips">*</div>
				</div>
				<div class="flexBox">
					<div class="label">内容：</div>
					<textarea type="text" class="flex content" name="content" autocomplete="off" class="form-control"
						rows="3"></textarea>
					<div class="tips">*</div>
				</div>
				<div class="flexBox code">
					<div class="label">验证码：</div>
					<input type="text" class="flex codeInput" name="codeInput" autocomplete="off" />
					<div class="tips"><img src="" alt="" /></div>
				</div>
				<div class="btnBox">
					<button type="button" class="btn comfirn">提交</button>
					<button type="button" class="btn reset">重置</button>
				</div>
			</form>
		</div>
		<div class="traffic  container p-0">
			<div class="row">
				<div class="col-lg-2 col-xl-2 mb-4 border-b">
					<a class="collapseTrafficBtn" data-toggle="collapse" href="#collapseTraffic" role="button"
						aria-expanded="true" aria-controls="collapseTraffic">
						<div class="d-flex justify-content-between align-items-center">
							<label style="width: 16px"></label>
							<label class="mb-0"></label>
							<i class="bi bi-chevron-down" style="font-size: 1rem"></i>
						</div>
					</a>
					<ul class="list-group list-group-flush collapse show  text-center collapseTraffic"  id="collapseTraffic">
						<li class="list-group-item active" data-name="wuhan" data-value="30.536265, 114.325941">
							武汉方向
						</li>
						<li class="list-group-item" data-name="huangshi"  data-value="30.199146,115.036769">黄石方向</li>
						<li class="list-group-item" data-name="ezhou"  data-value="30.397753,114.891930">鄂州方向</li>
						<li class="list-group-item" data-name="xianning"  data-value="29.858659,114.318924">咸宁方向</li>
					</ul>
				</div>
				<div class="col-lg-10 col-xl-10">
					<div id="map"></div>
				</div>
			</div>
		</div>
	</div>
	<footer id="footer"></footer>
	<div class="position-fixed bottom-0 right-0 p-3" style="
				z-index: 5;
				right: 50%;
				bottom: 50%;
				transform: translate(50%, 50%);
			">
		<div id="liveToast" class="toast hide" role="alert" style="width: 500px" aria-live="assertive"
			aria-atomic="false" delay="2000">
			<div class="toast-header">
				<strong class="mr-auto">提示</strong>
				<button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>

			<div class="toast-body"></div>
		</div>
	</div>
</body>
<script src="./src/lib/jquery-3.5.1.js"></script>

<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
	integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
	crossorigin="anonymous"></script>
<script src="./src/lib/bootstrap/js/bootstrap.min.js"></script>
<script src="./src/js/visitorLayout.js" type="module"></script>
<script src="https://map.qq.com/api/gljs?v=1.exp&key=4NKBZ-2VVK3-OU532-3GXEK-CJ5IQ-SAFAC&libraries=service"></script>
<script src="./src/js/visitor.js" type="module"></script>
</html>